<template>
<div class="edit-form">
    <div v-if="!formData.show" class="exp-prop">
        <div class="e-p-title">实验属性</div>
        <div class="e-p-con">
            <p class="e-p-c-item">项目名称：{{'撒旦飞洒地'}}</p>
            <p class="e-p-c-item">创建日期：{{'2018-11-23 21:43:4'}}</p>
            <p class="e-p-c-item">创建人：{{'Eric'}}</p>
            <p class="e-p-c-item">名称：</p>
            <p class="e-p-c-item">
                <el-input clearable placeholder="请输入项目名称" v-model="name"></el-input>
            </p>
            <p class="e-p-c-item">描述：</p>
            <p class="e-p-c-item">
                <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4}" clearable placeholder="请输入项目描述" v-model="desc"></el-input>
            </p>
        </div>
    </div>
    <el-tabs v-else type="border-card">
        <el-tab-pane label="参数设置">参数设置</el-tab-pane>
        <el-tab-pane label="执行调优">执行调优</el-tab-pane>
    </el-tabs>
</div>
</template>

<script>
export default {
    name: 'EditForm',
    props: {
        formData: {
            required: true,
            type: Object
        }
    },
    data () {
        return {
            name: '',
            desc: ''
        }
    }
}
</script>

<style lang="less">
.edit-form {
    height: 100%;
    .el-tabs {
        border: none;
        height: 100%;
        background: #EBEEF5;
    }
    .is-active {
        background: #EBEEF5 !important;
    }
    .e-p-title {
        text-align: center;
        line-height: 40px;
        border-bottom: 1px solid #e4e7ed;
    }
    .e-p-con {
        padding: 10px;
    }
    .exp-prop {
        height: 100%;
    }
}
</style>
